feat(web): collapse mobile composer by default#1263
feat(web): collapse mobile composer by default#1263chirino wants to merge 1 commit intopingdotgg:mainfrom
Conversation
|
Important Review skippedAuto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Repository UI Review profile: CHILL Plan: Pro Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment Tip CodeRabbit can suggest fixes for GitHub Check annotations.Configure the |
github-actions
bot
added
size:M
![macroscopeapp[bot]](https://avatars.githubusercontent.com/in/900172?s=60&v=4){kind=small}
Collapse the chat composer into a compact mobile preview until the user focuses or taps it, while preserving quick-send behavior for existing prompt content. Signed-off-by: Hiram Chirino <hiram@hiramchirino.com>
chirino
force-pushed
the
chat-input-mobile
branch
from
b53d038 to
5c33d5c
Compare
| : (prompt.trim() || "Ask anything...")} | ||
| </span> | ||
| <button | ||
| type="submit" |
There was a problem hiding this comment.
🟡 Medium components/ChatView.tsx:3649
The collapsed mobile send button (lines 3649-3659) allows submission when activePendingProgress exists but canAdvance is false. It only checks composerSendState.hasSendableContent, which doesn't validate whether the user has selected an option or provided a valid custom answer. This lets users submit incomplete responses that would be blocked in the expanded view (lines 3951-3979). Consider disabling the button when activePendingProgress exists and !activePendingProgress.canAdvance.
🚀 Reply "fix it for me" or copy this AI Prompt for your agent:
In file apps/web/src/components/ChatView.tsx around line 3649:
The collapsed mobile send button (lines 3649-3659) allows submission when `activePendingProgress` exists but `canAdvance` is false. It only checks `composerSendState.hasSendableContent`, which doesn't validate whether the user has selected an option or provided a valid custom answer. This lets users submit incomplete responses that would be blocked in the expanded view (lines 3951-3979). Consider disabling the button when `activePendingProgress` exists and `!activePendingProgress.canAdvance`.
Evidence trail:
apps/web/src/components/ChatView.tsx:3649-3659 (collapsed mobile button disabled condition), apps/web/src/components/ChatView.tsx:3967-3971 (expanded view button disabled condition), apps/web/src/pendingUserInput.ts:121 (canAdvance definition), apps/web/src/components/ChatView.tsx:2809-2819 (onAdvanceActivePendingUserInput function), apps/web/src/components/ChatView.tsx:2353-2355 (onSend calls onAdvanceActivePendingUserInput when activePendingProgress exists)
|
@chirino Can you please include before/after screenshots or video in your PR description? |
and
|
2 participants
Summary
On mobile viewports (< 640px), the chat composer now collapses to a compact single-row input when not focused, freeing up vertical space for reading the conversation. Tapping the collapsed bar expands the full composer with editor focus; blurring collapses it back.
Fixes #1262
Changes
Note
Collapse mobile composer by default in ChatView
requestAnimationFrame; blur collapses it again.Macroscope summarized 5c33d5c.